<template>
  <div class="city-fixed" @click="cityClick">
    <span>
      <slot></slot>
    </span>
    <span class="iconfont icon-jiantouxia"></span>
  </div>
</template>

<script>
export default {
  name: 'cityFixed',
  methods: {
    cityClick() {
      this.$emit('click')
    }
  }
}
</script>

<style lang="scss" scoped>
.city-fixed {
  position: absolute;
  top: 0.18rem;
  left: 0.07rem;
  color: #fff;
  z-index: 10;
  font-size: 0.13rem;
  background: rgba(0, 0, 0, 0.2);
  height: 0.3rem;
  line-height: 0.3rem;
  border-radius: 0.15rem;
  text-align: center;
  padding: 0 0.05rem;
  .icon-jiantouxia {
    display: inline-block;
    font-size: 0.14rem !important;
    transform: scale(0.7);
  }
}
</style>